import Vue from 'vue'
// 1.引入路由包
import VueRouter from 'vue-router'
//2.安装插件包到vue上
Vue.use(VueRouter)
// 现在需求是根据用户充钱的多少,来动态显示路由
//3.路由配置
// let routers = [
// 	{path:'/home',component:home}
// ]

//4.路由实例
let router = new VueRouter({
	routes: [],
	  mode: 'history',
	  scrollBehavior(to, from, savedPosition) {
	    return {
	      x: 0,
	      y: 0
	    }
	  }
})

// 8.引入数据
import home from '../pages/home.vue'
import login from '../pages/login.vue'
import reg from '../pages/reg.vue'
import column from '../pages/column.vue'
import follow from '../pages/follow.vue'
import detail from '../pages/detail.vue'
import cart from '../pages/cart.vue'
import flist from '../pages/flowerlist.vue'
import user from '../pages/user.vue'
import NoPage from '../pages/no-page.vue'

// 6.打造一个假数据,假如说用户冲的钱多,显示的页面多
let data = [
	  {path:'/home',component:home,meta:'首页'},
	  {path:'/follow',component:follow,meta:'关注'},
	  {path:'/column',component:column,meta:'栏目'},
	  {path:'/detail/:_id',component:detail,meta:'详情'},
	  {path:'/cart',component:cart,meta:'购物车'},
	  {path:'/flowerlist',component:flist,meta:'鲜花列表'},
	  {path:'/user',component:user,meta:'我的'},
	  {path:'/login',component:login,meta:'登录'},
	  {path:'/reg',component:reg,meta:'注册'},
	  {path:'/',redirect:'/home'},
	  {path:'*',component:NoPage,meta:'该也找不到'},
];


// 7.添加路由--动态添加路由--addRoutes
router.addRoutes(data)


// 8.axios
// import axios from 'axios'
import axios from './axios.js'

// 9.全局路由前置守卫来读取数据
router.beforeEach((to, from, next) => {
	// console.log('beforeEach');
	// console.log('Router中将要前往的地址',to);
	// console.log(to);
	// console.log('to.path:',to.path);
	// console.log('to.params:',to.params);
	// console.log('to.query:',to.query);
	// to.params:查数据库,只有detail后面有动态的_id
	//to.query拿到的是?后面的字符串
	// console.log(router);
	// console.log(to,from);
	
	let path = to.path
	
	if(path.includes('/login') || path.includes('/reg')){
		next()
	}else{
		let collectionName = ''
		// if(path.includes('/home')) collectionName='home'
		if(/home/.test(path)) collectionName='home'
		if(path.includes('/column')) collectionName='column'
		if(path.includes('/follow')) collectionName='follow'
		if(path.includes('/user')) collectionName='user'
		if(path.includes('/flowerlist')) collectionName='flower'
		if(path.includes('/detail')) collectionName=to.query.collectionName
		// 怎么样查详情:就是查那个接口的详情   就是
		//http://localhost:3000/api/news/home??_limit=10&_page=1 
		// http://localhost:8080/detail/60b8c7dcc1d2a8c2f192626d?collectionName=home  详情只能这样查
		let url=to.params._id ? `/news/${collectionName}/${to.params._id}` : `/news/${collectionName}`;
		url = collectionName == 'user' ? `/${collectionName}` : url;
		axios({
			url,
		}).then(
					res=>{
						 // console.log(res.data.data)
						        if(res.data.err===2){
						          console.log('全局前置守卫',res)
						          // next({path:'/login'})
								  next(`/login?p=${to.fullPath}`)
						        }else if(res.data.err===1){
						          next();//不存在接口
						        }else{
						          to.query.data = res.data.data;
						          next()
						        }
						}
				)
	}
	
	
})


//5.导出路由实例,让他控制vue的根
export default router